﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>WetherDemo</title>
    <link href="../../static/Assets/Plugins/swiper/swiper.min.css" rel="stylesheet" />
    <link href="../../static/Assets/css/comm.css" rel="stylesheet" />
    <link href="../../static/Assets/css/index.css" rel="stylesheet" />
    <script src="../../static/Assets/Plugins/jquery/jquery-1.11.2.min.js"></script>
    <script src="../../static/Assets/Plugins/swiper/swiper.jquery.min.js"></script>
</head>

<body>
    <!--头部-->
    <div class="top_opacity">
        <div class="top">
            <div class="top_nav">
                <a href="{{ url_for('main') }}">首页</a>
                <a href="{{ url_for('login') }}">登陆</a>
                <a href="{{ url_for('weather') }}">天气查询</a>
                <a href="{{ url_for('walking') }}">路径规划-步行</a>
                <a href="{{ url_for('view_the_log') }}">日志系统</a>
                <a href="#">搜索</a>
            </div>
        </div>
    </div>

    <!--焦点图-->
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <img src="../../static/Assets/images/banner_4.png"/>

                <div style="position: absolute;
                font-size:40px;
                z-index: 100;left:
                100px;top:150px;
                {#color: #F7F7F7;#}
                -webkit-text-fill-color: white;
                -webkit-text-stroke-color: black;
                -webkit-text-stroke-width: 2.75px;
                 text-shadow: #FF00FF 3px 3px 3px">
                   出行小助手</div>

                <div style="position: absolute;font-size:40px;
                z-index: 100;left: 200px;top:250px;color: #F7F7F7; text-shadow: #FF00FF 2px 2px 2px">
                   致力为每位用户打造“我的短距离生活圈”</div>
                <div style="position: absolute;font-size:35px; z-index: 100;
                left: 200px;top:300px;color: #F7F7F7; text-shadow: #FF00FF 2px 2px 2px">
                   “懂”天气 “识”附近 “熟”路线</div>
                <div style="position: absolute;font-size:35px; z-index: 100;
                left: 200px;top:350px;color: #F7F7F7; text-shadow: #FF00FF 2px 2px 2px">
                   解决短距离需求</div>
                </div>

            <div class="swiper-slide">
                <img src="../../static/Assets/images/banner_5.png" />
            </div>

            <div class="swiper-slide">
                <img src="../../static/Assets/images/banner_6.png" />
            </div>

        </div>
        <div class="swiper-pagination"></div>
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
    </div>

    <div class="main"></div>

    <div class="foot">
        <div class="foot_child">
            <div class="foot_left">
                <span>Designed By ZhongLi</span>
            </div>
            <div class="foot_right">
                <a href="{{ url_for('login') }}">加入我们</a>
                <a>|</a>
                <a href="#">Nothing</a>
            </div>
        </div>
    </div>

    <script>
        var swiper = new Swiper('.swiper-container', {
            pagination: '.swiper-pagination',
            nextButton: '.swiper-button-next',
            prevButton: '.swiper-button-prev',
            slidesPerView: 1,
            paginationClickable: true,
            spaceBetween: 30,
            loop: false
        });
    </script>

</body>
</html>